

<template>
<div >
  <a-row :gutter="[12,12]">
    <a-col v-for=" (item , index) in dataList" :key="index" :span="4">
      <a-card>
        <a-statistic :title="item.label" :value="item.value" show-group-separator >
          <template #suffix> <span  style="margin-left: 6px">{{item.dw}}</span></template>
        </a-statistic>
      </a-card>
    </a-col>
  </a-row>


  <a-row :gutter="[12,12]">

    <a-col :span="12">
    <person-card />

    </a-col>
    <a-col :span="12">
      <ba-card />

    </a-col>
    <a-col :span="12">
      <zd-card />

    </a-col>




    <a-col :span="12">
      <school-card />

    </a-col>
  </a-row>

   </div>
</template>

<script setup lang="ts" name="portal-home">
import {ref} from "vue";
import PersonCard from './components/person.vue'
import ZdCard from './components/zd.vue'
import BaCard from './components/binan.vue'
import SchoolCard from './components/school.vue'

const dataList=[
  {label:'辖区数量',value:12   ,dw:'个'} ,
  {label:'辖区人口',value:254,dw:'万人'} ,
  {label:'重点企业',value:654,dw:'家'} ,
  {label:'医疗机构',value:554,dw:'所'} ,
  {label:'消防机构',value:284,dw:'所'} ,
  {label:'避难机构',value:354,dw:'所'} ,
  {label:'学校数量',value:128,dw:'所'} ,
  {label:'电厂电站',value:40,dw:'座'} ,
  {label:'通信机构',value:76,dw:'家'} ,
  {label:'河流条数',value:325,dw:'条'} ,
  {label:'铁路条数',value:8,dw:'条'} ,
  {label:'高速公路',value:6,dw:'条'} ,
]

const text=ref('')

</script>
